<template>
    <base-breadcrumb>
        <a-card class="mb20">
            <titleName title="基本信息"></titleName>
            <a-form-model
                ref="ruleForm"
                :rules="rules"
                :model="form"
                :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
                :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
            >
                <a-row :gutter="24">
                    <a-col :md="8" :sm="8">
                        <a-form-model-item label="所属分公司：" prop="branchComId">
                            <SelectSubCompany
                                :disabled="pageType == 'edit'"
                                placeholder="请选择"
                                v-model="form.branchComId"
                            ></SelectSubCompany>
                        </a-form-model-item>
                    </a-col>
                    <a-col :md="8" :sm="8">
                        <a-form-model-item label="所属项目：" prop="projectId">
                            <SelectProject
                                placeholder="请选择"
                                v-model="form.projectId"
                                :disabled="pageType == 'edit'"
                                :form="form"
                                @change="inputChangeTime"
                                :isClear="id == ''"
                                keyValue="branchComId"
                            ></SelectProject>
                        </a-form-model-item>
                    </a-col>
                    <a-col :md="8" :sm="8">
                        <a-form-model-item label="日志时间" prop="logTime">
                            <a-date-picker
                                :disabled-date="disabledMonth"
                                :disabled="pageType == 'edit'"
                                placeholder="请选择"
                                @change="inputChangeTime"
                                v-model="form.logTime"
                            />
                        </a-form-model-item>
                    </a-col>
                    <a-col :md="24" :sm="24">
                        <a-form-model-item label="其他" prop="other">
                            <BaseTextarea
                                :autoSize="{ minRows: 20, maxRows: 25 }"
                                :maxLength="3000"
                                placeholder="请输入"
                                v-model="form.other"
                            ></BaseTextarea>
                        </a-form-model-item>
                    </a-col>
                </a-row>
            </a-form-model>
        </a-card>
        <div class="tool-btns page-btn-right-top">
            <!-- <a-button
                v-if="id != '' && form.auditStatus == 'DRAFT'"
                type="danger"
                :loading="loading.DELETE"
                @click="handleSave('DELETE')"
                >删除草稿</a-button
            > -->
            <a-button type="primary" :loading="loading.DRAFT" @click="handleSave('DRAFT')">提交</a-button>
            <!-- <a-button type="primary" :loading="loading.SUBMITTED" @click="handleSave('SUBMITTED')">提交</a-button> -->
            <a-button type="primary" @click="handleClose">关闭</a-button>
        </div>
        <!-- <div class="tool-btns" v-else>
            <a-button type="primary" @click="handleClose">关闭</a-button>
        </div> -->
    </base-breadcrumb>
</template>
<script>
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 分公司
import {
    getSecurityLogDetail,
    addSecurityLog,
    deleteSecurityLog,
    updateSecurityLog,
    inputChangeTime,
} from '@/api/safetySupervision/securityLog'
export default {
    name:'a'+Date.now(),    components: {
        SelectSubCompany,
        SelectProject,
    },
    data() {
        return {
            id: '',
            form: {},
            loading: {
                DELETE: false,
                DRAFT: false,
                SUBMITTED: false,
            },

            rules: {
                branchComId: [{ required: true, message: '请选择分公司' }],
                projectId: [{ required: true, message: '请选择所属项目' }],
                other: [{ required: true, message: '请输入其他' }],
                logTime: [{ required: true, message: '请选择日志时间' }],
            },
            pageType: '',
            isEdit: false,
        }
    },
    created() {
        this.id = this.$route.query.id
        this.pageType = this.$route.query.pageType
        if (this.pageType == 'add') {
            this.$route.meta.title = '新增安全监督日志'
        } else {
            this.$route.meta.title = '编辑安全监督日志'
        }
        this.getSecurityLogDetail()
    },
    // computed: {
    //     pageType() {
    //         return this.$route.query.pageType || 'look'
    //     },
    //     isDisabled() {
    //         return this.pageType == 'edit'
    //     },
    // },
    methods: {
        disabledMonth(current) {
            return current && (current < this.moment().subtract(3, 'day') || current > this.moment().subtract(0, 'day'))
        },
        async inputChangeTime(e) {
            if (!this.form.logTime) return
            this.form.logTime = typeof this.form.logTime =='string' ? this.form.logTime : this.form.logTime.format('YYYY-MM-DD')
            let params = {
                userId: JSON.parse(sessionStorage.getItem('ycloud-user_info')).id,
                logTime: this.form.logTime,
                projectId: this.form.projectId,
            }
            const [err, res] = await inputChangeTime(params)
            if (!err) {
                this.form = {
                    ...this.form,
                    other: res.data?.length > 0 ? res.data[0].other : '',
                    id: res.data?.length > 0 ? res.data[0].id : '',
                }
                this.isEdit = res.data?.length > 0
            }
        },
        async getSecurityLogDetail() {
            const { id } = this.$route.query
            if (!id) return
            const params = {
                id,
            }
            const [err, res] = await getSecurityLogDetail(params)
            if (!err) {
                this.form = {
                    ...this.form,
                    ...res.data,
                }

                console.log(this.form)
            }
        },
        validateForm() {
            let flag = false
            this.$refs.ruleForm.validate((valid) => {
                flag = valid
              if(!valid) {
                this.$message.warning("请填写完所有必填项信息")
              }
            })
            return flag
        },
        // 处理增、删、改操作
        async handleSave(status) {
            if (status !== 'DELETE' && !this.validateForm()) return
            if (this.loading[status]) return
            this.loading[status] = true
            const params = {
                ...this.form,
                auditStatus: status,
                id: this.$route.query.id || this.form.id || void 0,
            }
            const { pageType } = this.$route.query
            const fn = pageType === 'edit' || this.isEdit ? updateSecurityLog : addSecurityLog
            const map = {
                DELETE: deleteSecurityLog,
                DRAFT: fn,
                SUBMITTED: fn,
            }
            const [err, res] = await map[status](params)
            if (!err) {
                this.$message.success('保存成功')
                this.handleClose()
            }
            this.loading[status] = false
        },
        handleClose() {
            this.$multiTab.close(this.$route.fullpath)
            //  history.go(-1)
        },
    },
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
.tool-btns {
    display: flex;
    justify-content: flex-end;
    @{deep} .ant-btn + .ant-btn {
        margin-left: 12px;
    }
}
.row {
    display: flex;
    flex-direction: row;
}
</style>
